<template>
  <div class="myorder">
    <div class="cite">我的订单</div>
    <div class="allcite" @click="ToMyOrder">全部订单</div>
  </div>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
  name: 'MyOrder',
  data () {
    return {
      id: 2
    }
  },
  computed: mapGetters('user', ['isLogined']),
  methods: {
    ToMyOrder () {
      if (this.isLogined) {
        this.$router.push({ name: 'myorder', query: { type: 0 } })
      } else {
        this.$router.push({ name: 'login' })
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.myorder {
  width: 100%;
  height: 0.4168rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  border-bottom: 2px solid rgb(217, 217, 217);
  .cite {
    font-size: .154rem;
    padding: 0 0 0 0.16rem;
    color: rgba(0,0,0,.87);
    position: relative;
  }
  .allcite {
    padding: 0 0.32rem 0 0 ;
    font-size: 13px;
  }
}
.myorder::after {
    content: "";
    position: absolute;
    right: 0.16rem;
    color: rgb(127, 127, 127);
    top: 50%;
    width: 0.1rem;
    height: 0.1rem;
    border-left: 1px solid currentColor;
    border-top: 1px solid currentColor;
    text-decoration: inherit;
    vertical-align: inherit;
    box-sizing: inherit;
    transform: translate3d(0,-50%,0) rotate(135deg);
    -webkit-transform: translate3d(0,-50%,0) rotate(135deg);
  }
</style>
